<div class="user-register-container">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">注册</h3>
        </div>
    </div>
    <div class="panel-body">
        <form [formGroup]="userform" (ngSubmit)='doRegister()' autocomplete='off' class='form-horizontal' role='form' novalidate>
            <div class="form-group" [ngClass]="{'has-error': formErrors.email}">
                <label for="email" class='col-md-3 control-label'>邮箱</label>
                <div class="col-md-8">
                    <input formControlName='email' type="email" class="form-control" placeholder='请输入邮箱'>
                    <div class="text-danger" *ngIf="formErrors.email">
                        {{formErrors.email}}
                    </div>
                </div>
            </div>
            <div class="form-group" [ngClass]="{'has-error': formErrors.password}">
                <label for="password" class="col-md-3 control-label">密码</label>
                <div class="col-md-8">
                    <input type="password" formControlName='password' appEqualValidator validateEqual='confirmPassword' reverse=true placeholder='请输入密码' class='form-control'>
                    <div class="text-danger" *ngIf="formErrors.password">
                        {{formErrors.password}}
                    </div>
                </div>
            </div>
            <div class="form-group" [ngClass]="{'has-error': formErrors.confirmPassword}">
                <label for="confirmPassword" class="col-md-3 control-label">确认密码</label>
                <div class="col-md-8">
                    <input type="password" name="confirmPassword" appEqualValidator validateEqual='password' formControlName='confirmPassword' class='form-control' placeholder='请确认密码'>
                    <div class="text-danger" *ngIf="formErrors.confirmPassword">
                    {{formErrors.confirmPassword}}
                    </div>
                </div>
            </div>
            <div *ngIf="formErrors.formError" class="col-md-offset-3 col-md-8 alert alert-danger">
                {{formErrors.formError}}
            </div>
            <div class="form-group">
                <div class="col-md-offset-s col-md-8">
                    <button [disabled]='userform.invalid' type='submit' class="btn btn-primary">注册</button>
                </div>
            </div>
        </form>
    </div>
</div>
